{include file="public/layout" /}
<link rel="stylesheet" type="text/css" href="/public/static/css/category.css" />
<body style="background-color: rgb(255, 255, 255); overflow: auto; cursor: default;">
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 
<span class="c-gray en">&gt;</span> 分类管理 
<span class="c-gray en">&gt;</span> 商品分类列表
<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i>
</a>
</nav>
<div class="page" style="padding-top: 2rem;">
  <form method="post">
    <input type="hidden" value="ok" name="form_submit">
    <div class="flexigrid">
      <div class="tDiv">
        <div class="tDiv2">
          <div class="fbutton">
            <a href="{:U('Goods/addEditCategory')}">
              <div title="新增分类" class="add">
                <span><i class="fa fa-plus"></i>新增分类</span>
              </div>
            </a>  
          </div>
          <div class="fbutton">
            <div class="add" title="收缩分类">
              <span onclick="tree_open(this);"><i class="fa fa-angle-double-down"></i>展开分类</span>
            </div>
          </div>
        </div>
        <div style="clear:both"></div>
      </div>      
      <div style="height: auto;" class="bDiv" id="flexigrid"  data-url="{:U('Goods/delGoodsCategory')}">
        <table cellspacing="0" cellpadding="0" border="0" id="article_cat_table" class="flex-table autoht">
          <tbody id="treet1">
         {foreach name="cat_list" item="vo" key="k" }
          <tr data-level="{$vo.level}" parent_id_path ="{$vo.parent_id_path}" class="parent_id_{$vo.parent_id}" id="{$vo.level}_{$vo.id}" {if $vo.level > 1 } style="display:none;" {/if}>
              <td class="sign">
                <div style="text-align: center; width: 100px;"> 
                  <img src="/public/static/images/tv-expandable.gif" fieldid="2" status="open" id="icon_{$vo.level}_{$vo.id}" onClick="treeClicked(this,{$vo.id})">
                </div>
              </td>
               <td class="handle">
                <div style="text-align:center;   min-width:120px !important; max-width:inherit !important;">
                  <span style="margin-left:{$vo.level * 3}em" class="btn"><em><i class="fa fa-cog"></i>设置<i class="arrow"></i></em>
                  <ul>
                    <li><a href="{:U('Goods/addEditCategory',array('cate_id'=>$vo['id']))}">编辑分类信息</a></li>
                    {if $vo.level < 3}                  
                    <li><a href="{:U('Goods/addEditCategory',array('parent_id'=>$vo['id']))}">新增下级分类</a></li>
                    {/if}
                    <li><a href="javascript:;" onclick="del(this)" data-url="/Admin/Goods/delGoodsCategory" data-id="{$vo.id}">删除当前分类</a></li>
                  </ul>
                  </span>
                </div>
              </td>
               <td class="sort">
                <div style="text-align: center; width: 60px;">{$vo.id}</div>
              </td>
              <td class="name">
                <div style="text-align: center; width: 200px;">
                  <input type="text" value="{$vo.name}" onblur="changeTableVal('goods_category','id','{$vo.id}','name',this)" style="text-align: left; width:180px; border: solid 1px #F5F5F5; height: 20px;"/>
                </div>
              </td>                
              <td align="center" class="">
                  <div style="text-align: center; width: 80px;">
                    {if $vo.is_show == 1}
                      <span class="yes" onClick="changeTableVal('goods_category','id','{$vo.id}','is_show',this)" ><i class="fa fa-check-circle"></i>是</span>
                      {else /}
                      <span class="no" onClick="changeTableVal('goods_category','id','{$vo.id}','is_show',this)" ><i class="fa fa-ban"></i>否</span>
                    {/if}
                  </div>
              </td>
               <td class="sort">
                <div style="text-align: center; width: 60px;">
                  <input type="text" onKeyUp="this.value=this.value.replace(/[^\d]/g,'')" onpaste="this.value=this.value.replace(/[^\d]/g,'')" onblur="changeTableVal('goods_category','id','{$vo.id}','sort_order',this)" size="4" value="{$vo.sort_order}" style="border: solid 1px #F5F5F5; height: 20px;" />
                </div>
              </td>                                                           
              <td style="width: 100%;">
                <div>&nbsp;</div>
              </td>
            </tr>
           {/foreach}                               
          </tbody>
        </table>        
      </div>
    </div>
</div>
{include file="public/footer" /}
<script type="text/javascript">
    //删除分类
    function del(obj,id){
      layer.confirm('确认要删除吗？',function(index){
        $.ajax({
          type: 'POST',
          url: $(obj).attr('data-url'),
          data : {act:'del',ids:$(obj).attr('data-id')},
          dataType: 'json',
          success: function(data){
            $(obj).parents("tr").remove();
            layer.msg(data.msg,{icon:1,time:1000});
          },
          error:function(data) {
            console.log(data.msg);
          },
        });   
      });
    }

    // 点击展开 收缩节点
    function  tree_open(obj)
    {
      var tree = $('#article_cat_table tr[id^="2_"], #article_cat_table tr[id^="3_"] '); //,'table-row'
      if(tree.css('display')  == 'table-row')
      {
        $(obj).html("<i class='fa fa-angle-double-down'></i>展开分类");
        tree.css('display','none');
        $("img[id^='icon_']").attr('src','/public/static/images/tv-expandable.gif');
      }else
      {
        $(obj).html("<i class='fa fa-angle-double-up'></i>收缩分类");
        tree.css('display','table-row');
        $("img[id^='icon_']").attr('src','/public/static/images/tv-collapsable-last.gif');
      }
    }
       
    function treeClicked(obj,cat_id){
       var src = $(obj).attr('src');
       if(src == '/public/static/images/tv-expandable.gif')
       {
         $(".parent_id_"+cat_id).show();
         $(obj).attr('src','/public/static/images/tv-collapsable-last.gif');
       }else{      
         $(obj).attr('src','/public/static/images/tv-expandable.gif');       
         
         // 如果是点击减号, 遍历循环他下面的所有都关闭
         var tbl = document.getElementById("article_cat_table");
         cur_tr = obj.parentNode.parentNode.parentNode;
         var fnd = false;
          for (i = 0; i < tbl.rows.length; i++)
          {
            var row = tbl.rows[i];
            
            if (row == cur_tr)
            {
              fnd = true;         
            }
            else
            {
              if (fnd == true)
              {
               
                var level = parseInt($(row).data('level'));
                var cur_level = $(cur_tr).data('level');
               
                if (level > cur_level)
                {
                  $(row).hide();    
                  $(row).find('img').attr('src','/public/static/images/tv-expandable.gif');
                }
                else
                {
                  fnd = false;
                  break;
                }
              }
            }
          }      
       }     
      }

</script>
</body>
</html>